<template>
	<view class="content">
		<view class="close">
			<view class="font2" v-if="times!==0" @click="back">跳过</view>

			<view class="font" v-if="times!==0">剩 {{times}}</view>
			<view class="font" v-if="times===0" @click="success">下一步</view>

		</view>
		<video class="controls-play img" id="myVideo" :src="item.link" binderror="videoErrorCallback"
			:show-center-play-btn='false' :show-play-btn="false" :controls="false" :autoplay="true" :loop="true"
			direction="0" @play="inter" :show-fullscreen-btn="false" :show-mute-btn="true"
			:enable-progress-gesture="false"></video>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				adList: [],
				item: {},
				times: 0,
				type: 0,
				//总高度
				height: 0,
				//胶囊位置信息
				menuButtonRect: {},
				//状态栏的高度
				statusBarHeight: 0,
				//导航栏的高度
				navBarHeight: 0,
				groupId: null,
			};
		},

		onLoad(item) {
			this.videoContext = wx.createVideoContext('myVideo')
			this.$innerAudioContext.src = item.link
			this.type = item.type
			this.item = item;
			this.times = item.times
			this.groupId = item.groupId
			this.videoContext.play()
		},
		onUnload() {
			this.$innerAudioContext.stop() // 播放
		},
		onHide() {
			this.$innerAudioContext.stop() // 播放
		},
		methods: {
			inter() {
				setInterval(this.cutTime, 1000);
			},
			async getRandomAd() {
				this.$api.request({
					url: this.$api.advertList,

				}).then(res => {
					this.adList = res.data;
					this.item = this.adList[Math.floor(Math.random() * this.adList.length)]
					this.items = this.item.second
					setInterval(this.cutTime, 1000);
					this.$api.request({
						url: this.$api.showAd,
					})

				})
			},
			cutTime() {
				if (this.times > 0) {
					this.times = this.times - 1
				}
			},
			back() {
				uni.navigateBack()
			},
			getHeight() {
				if (wx.canIUse('getMenuButtonBoundingClientRect')) {
					let sysInfo = wx.getSystemInfoSync(); //状态栏的高度
					this.statusBarHeight = sysInfo.statusBarHeight;
					// 胶囊位置信息
					let rect = wx.getMenuButtonBoundingClientRect();
					this.menuButtonRect = JSON.parse(JSON.stringify(rect));
					// 导航栏高度
					let navBarHeight = (rect.top - sysInfo.statusBarHeight) * 2 + rect.height;
					this.navBarHeight = navBarHeight;
					// 自定义导航栏的高度
					this.height = sysInfo.statusBarHeight + navBarHeight;
				} else {
					wx.showToast({
						title: '您的微信版本过低，界面可能会显示不正常',
						icon: 'none',
						duration: 4000
					});
				}
			},
			success() {
				this.$api.request({
					url: this.$api.adLog,
				})
				if (this.type == 0) {
					uni.redirectTo({
						url: "/pages/my/card/card"
					})
				}
				if (this.type == 1) {
					uni.setStorageSync("lastCheckAdTime", Date.now())
					uni.navigateBack()
				}
				//跳转签到页面
				if (this.type == 3) {
					uni.setStorageSync("lastIndexAdTime", Date.now())
					this.$api.request({
						url: this.$api.signUP,
						data: {
							cardGroupId: this.groupId
						}
					}).then(res => {
						uni.redirectTo({
							url: "/myPage/check/check",
						})

					})
				}
			},
		},
	};
</script>

<style lang="less" scoped>
	@import "@/static/css/app.less";

	.content {
		//display: flex;
		//flex-direction: column;
		//align-items: center;
		position: relative;

		.close {
			display: flex;
			z-index: 10;
			position: absolute;
			left: 10%;
			margin-top: 15%;
			background-color: #c2bfbf;
			border-radius: 32rpx;

			.font2 {
				padding-left: 20rpx;
				padding-right: 20rpx;
				color: white;
				font-size: larger;
				text-align: center;
			}

			.font {
				padding-left: 20rpx;
				padding-right: 20rpx;

				font-size: larger;
				color: white;
			}

			image {
				width: 50rpx;
				height: 50rpx
			}
		}

		.controls-play {
			//display: block;
			z-index: 1;
			position: absolute;
			width: 100%;

			height: 100vh;
		}
	}
</style>